<template>
  <Card>
    <Row>
      <Col span="3" style="font-size: 20px">算法查询</Col>
      <Col span="4">
        <Input type="text" placeholder="请输入算法名或描述" v-model="fuzzyKey">
        <span slot="prepend">
        <Icon type="ios-cloud-circle" slot="prefix"/>
      </span>
        </Input>
      </Col>
      <Col span="4" offset="5">
        <Select v-model="creator" filterable remote :remote-method="remoteMethod" :loading="loading1" placeholder="数据集所有者信息">
          <Option v-for="(option, index) in options" :value="option.value" :key="index">{{option.label}}</Option>
        </Select>
      </Col>
      <Col span="2" offset="5"><Button type="primary" @click="searchAlgorithm">查询</Button></Col>
      <Col span="1"><Button icon="ios-add-circle-outline" @click="value3 = true"></Button></Col>
      <Drawer title="新建算法" v-model="value3" width="260" :mask-closable="false">
        <Form :model="formData" :rules="rules">
          <FormItem prop="name">
            <Input v-model="formData.name" placeholder="请输入算法名" >
              <span slot="prepend">
                <Icon type="ios-cloud-circle-outline" slot="prefix"/>
              </span>
            </Input>
          </FormItem>
          <FormItem prop="description">
            <Input type="textarea" :rows="4" v-model="formData.description" placeholder="请输入算法描述"/>
          </FormItem>
          <FormItem prop="password">
            <Upload :action="uploadUrl" :on-success="getResult" :headers="headers" name="fileUrl">
              <Button icon="ios-cloud-upload-outline" style="width:200px">上传</Button>
            </Upload>
          </FormItem>
          <Button type="primary" long @click="createAlgorithm">确认</Button>
        </Form>
      </Drawer>
    </Row>
  </Card>
</template>

<script>
  import {url} from '../../../config/url'
  import index from '../../store/index'
    export default {
        name: "algorithm-search",
      props: {
        nameRules: {
          type: Array,
          default: () => {
            return [
              { required: true, message: '算法名不能为空', trigger: 'blur' }
            ]
          }
        },
        descriptionRules:{
          type: Array,
          default: () => {
            return [
              { required: true, message: '算法描述不能为空', trigger: 'blur' }
            ]
          }
        }
      },
      data(){
        return{
          fuzzyKey:'',
          creator:'',
          uploadUrl:url+'/file',
          fileUrl:'',
          value3: false,
          loading1: false,
          options:[],
          algorithmList:[],
          headers:{
            Authorization:index.state.Authorization
          },
          formData: {
            name:'',
            description:'',
          },
        }
      },
      computed:{
        rules(){
          return{
            name:this.nameRules,
            description:this.descriptionRules,
          }
        }
      },
      methods:{
        //查询算法
        searchAlgorithm(){
          this.algorithmList=[];
          let query={
            'name':this.fuzzyKey,
            'description':this.fuzzyKey,
            'creator_id':this.creator,
            'fuzzy_key':['name','description'],
            'or_key':['name','description'],
          };
          this.$axios.get(url+'/algorithm',{
            params:{
              'data':query
            }
          }).then(res=> {
            if (res.data.error_code === 0) {
              let size = res.data.data.total_records;
              let records = res.data.data.records;
              for (let i = 0; i < size; i++) {
                let record = {
                  id: records[i].id,
                  name: records[i].name,
                  createTime: records[i].create_time,
                  description:records[i].description,
                };
                this.algorithmList.push(record)
              }
              this.$emit('algorithmList', this.algorithmList);
            } else {
              alert("查询失败")
            }
          })
        },

        //查询用户ID
        remoteMethod (query) {
          if (query !== '') {
            this.loading1 = true;
            let fuzzyKey=JSON.stringify({
              'name':query,
              'username':query,
              'fuzzy_key': ['name', 'username'],
              'or_key':['name', 'username']
            });
            this.$axios.get(url+'/user',{
              params:{
                'data':fuzzyKey
              }
            },{
              headers:{
                'Content-Type':'application/json'
              }
            }).then(res=>{
              if(res.data.error_code==0){
                let num=res.data.data.total_records;
                this.loading1 = true;
                setTimeout(() => {
                  this.loading1 = false;
                  for(let i=0;i<num;i++){
                    let record=res.data.data.records[i];
                    let list={
                      value: record.id,
                      label: record.username
                    };
                    if(this.options.length==0){
                      this.options.push(list);
                    }
                    if(this.options.length>0){
                      let flag=0;
                      for(let j=0;j<this.options.length;j++){
                        if(list.value==this.options[j].value){
                          flag=1;
                        }
                      }
                      if(flag==0){
                        this.options.push(list)
                      }
                    }
                  }
                }, 200);
              }
            })
          } else {
            this.options = [];
          }
        },

        //上传创建算法需要的条件
        createAlgorithm(){
          if(this.fileUrl.length>0){
            if(this.formData.name.length>0&&this.formData.description.length>0){
              this.$axios.post(url+'/algorithm',{
                'name':this.formData.name,
                'description':this.formData.description,
                'url':this.fileUrl
              },{
                headers: {
                  'Content-Type': 'application/json'
                }
              }).then(res=>{
                if(res.data.error_code==0){
                  alert("新建算法成功");
                  this.formData.name='';
                  this.formData.description='';
                  this.value3=false
                }else{
                  alert("新建算法失败："+res.data.error_code)
                }
              })
            }else {
              alert("创建算法条件不全，请补全条件")
            }
          }else{
            alert("上传算法配置文件未完成，请等待")
          }
        },

        //获取上传文件的返回结果
        getResult(response){
          this.fileUrl=response.data.dataSetupLoad
        }
      },

      //查询用户ID
      remoteMethod (query) {
        if (query !== '') {
          this.loading1 = true;
          let fuzzyKey=JSON.stringify({
            'name':query,
            'username':query,
            'fuzzy_key': ['name', 'username'],
            'or_key':['name', 'username']
          });
          this.$axios.get(url+'/user',{
            params:{
              'data':fuzzyKey
            }
          },{
            headers:{
              'Content-Type':'application/json'
            }
          }).then(res=>{
            if(res.data.error_code==0){
              let num=res.data.data.total_records;
              this.loading1 = true;
              setTimeout(() => {
                this.loading1 = false;
                for(let i=0;i<num;i++){
                  let record=res.data.data.records[i];
                  let list={
                    value: record.id,
                    label: record.username
                  };
                  if(this.options.length==0){
                    this.options.push(list);
                  }
                  if(this.options.length>0){
                    let flag=0;
                    for(let j=0;j<this.options.length;j++){
                      if(list.value==this.options[j].value){
                        flag=1;
                      }
                    }
                    if(flag==0){
                      this.options.push(list)
                    }
                  }
                }
              }, 200);
            }
          })
        } else {
          this.options = [];
        }
      },
      //获取上传文件的返回结果
      getResult(response){
        this.fileUrl=response.data.fileUrl;
      }
    }
</script>

<style scoped>

</style>
